 body{
  background-image: url(https://file.garden/ZrmnkoZC-lyg5jQj/neocities%20stuff/empty.gif);
  background-size: 100%;
 }

  @font-face {
        font-family:'Gloria';
        src: url(/Fonts/GloriaHallelujah-Regular.ttf);
 }
   @font-face {
        font-family:'mario';
        src: url(/Fonts/MarioLuigi2.ttf);
 }
 @font-face {
  font-family: 'gloria';
  src: url(/Fonts/PermanentMarker-Regular.ttf);
 }

.Bio {
  position: absolute;
  z-index: 999999;
  top: 35%;
}
#fileone { 
  border: 3px solid transparent;
  position: fixed;
		top: 21%;
		left: 23%;
		transform: translate(-50%, -50%);
		padding: 0 0.2vw;
    z-index: 3; 
    
}
#quotetwo { 
  font-family: gloria;
  transform: translateY(-10px); 
  position: fixed;
		top: 23%;
		left: 23%;
		transform: translate(-50%, -50%);
		padding: 0 0.2vw;
  text-align: left;
  background-color: rgb(255, 255, 255);
  border-width: 5px; 
  display: grid; 
  grid-template-columns: repeat(1%, 1fr); 
  grid-template-rows: repeat(0, 0fr); 
  grid-column-gap: 100px; 
  grid-row-gap: 7px; 
  grid-area: 1 / 1 / 1 / 1;
  overflow-wrap: break-word;
  width: 505px;
  height: 235px;
  z-index: 8;
  overflow: scroll;
  overflow-x: hidden;
  display: inline-block;
  
} 
#filetwo { 
  border: 2px solid transparent;
  position: fixed;
		top: 53%;
		left: 67%;
		transform: translate(-50%, -50%);
		padding: 0 0.2vw;
    z-index: 3; 
}
#main { 
  position: relative; 
}
#quote { 
  font-family: gloria;
  transform: translateY(-10px); 
  position: fixed;
		top: 55%;
		left: 66.99%;
		transform: translate(-50%, -50%);
		padding: 0 0.2vw;
  text-align: left;
  background-color: rgb(255, 255, 255);
  border-width: 5px; 
  display: grid; 
  grid-template-columns: repeat(1%, 1fr); 
  grid-template-rows: repeat(0, 0fr); 
  grid-column-gap: 100px; 
  grid-row-gap: 7px; 
  grid-area: 1 / 1 / 1 / 1;
  overflow-wrap: break-word;
  width: 785px;
  height: 710px;
  z-index: 8;
  overflow: scroll;
  overflow-x: hidden;
  display: inline-block;
  
} 
#title {
  font-family: gloria;
}
.parent {
  position: fixed;
  top: 317px;
  left: 643px;
  z-index: 900000;
  height: 60px;
}

 .peer {
display: grid;
grid-template-columns: repeat(5, 1fr);
grid-template-rows: repeat(5, 1fr);
grid-column-gap: 0px;
grid-row-gap: 0px;
border-style: solid;
border-color: black;
border-width: 5px; 
background-color: transparent;
 overflow-wrap: break-word;
  width: 210px;
  height: 220px;
  position: fixed;
  z-index: 9000000;
  overflow: auto;
  top: 180px;
  left: 70%;
}
#stack {
position: fixed;
left: 15%;
top: 49%;
z-index: 80000;
pointer-events: none;
}
#lightbulb {
  position: fixed;
  top: 0.10%;
  left: 7%;
}
#gohome {
  position: fixed;
  top: 80%;
  left: 30%;
}
 #profileone {
  font-size: 240%;
  white-space: nowrap;
 }
 #profileone img {
   width: 28%;
  height: 27%;
  object-position: 0% 0%;
  position: fixed;
  top: 7%;
color: black;
  background: transparent;
  padding: 4px;
 }
  #p1 {
   width: 20%;
  height: 20%;
  object-position: 0% 0%;
  position: fixed;
  left:1%;
  bottom: 74%;
  font-family: gloria;
  line-height: 1.2;
 }
   #p2 {
   width: 20%;
  height: 20%;
  object-position: 0% 0%;
  position: fixed;
  left:63%;
  bottom: 75%;
  font-family: gloria;
  line-height: 1.2;
 }
   #p3 {
   width: 20%;
  height: 20%;
  object-position: 0% 0%;
  position: fixed;
  left:49%;
  bottom: 20%;
  font-family: gloria;
  line-height: 1.2;
  z-index: 90000;
  font-size: 80%;
 }
 #offline {
  position: fixed;
  top: 5%;
  left: 29%;
  font-size: 70%;
  font-family:gloria;
  letter-spacing: -1px;
  color: grey;
  
 }
 .aboutmeone {
  display: grid;
  grid-template-columns: 1fr 3fr ;
  background-color: transparent;
  padding: 2px;
  width: 37%;
  height: 15%;
  position: fixed;
  top: 52%;
  border-image-width: 60px;
  border-image-outset: 6px;
  border-image-slice: 36%;
  border-image-repeat: stretch;
  border-style: solid;
  border-image-source: url("https://file.garden/ZrmnkoZC-lyg5jQj/neocities%20stuff/border.png");
}
.aboutmeone div {
  background-color: #e1401c;
  border: 3px solid rgb(255, 255, 255);
  padding: 3px;
  font-size: 20px;
  align-content: auto;
  text-align: center; 
  font-family: gloria;
  line-height: 1.2;
  
}

#divtwo {
border: none;
background-color: white;
text-align: left;
}
#divfour {
border: none;
background-color: white;
text-align: left;
}
#divsix {
border: none;
background-color: white;
text-align: left;
}
 .aboutmetwo {
  display: grid;
  grid-template-columns: 1fr 3fr ;
  background-color: transparent;
  padding: 2px;
  width: 43%;
  height: 26%;
  position: fixed;
  top: 70%;
  border-image-width: 60px;
  border-image-outset: 6px;
  border-image-slice: 36%;
  border-image-repeat: stretch;
  border-style: solid;
  border-image-source: url("https://file.garden/ZrmnkoZC-lyg5jQj/neocities%20stuff/border.png");
  
}
.aboutmetwo div {
  background-color: #e1401c;
  border: 3px solid rgb(255, 255, 255);
  padding: 3px;
  font-size: 20px;
  align-content: auto;
  text-align: center; 
  font-family: gloria;
  line-height: 1.2;
}

#diveight {
border: none;
background-color: white;
text-align: left;
}
#divten {
border: none;
background-color: white;
text-align: left;
}
#divtwelve {
border: none;
background-color: white;
text-align: left;
}
#divfourteen {
border: none;
background-color: white;
text-align: left;
}
#divsixteen {
border: none;
background-color: white;
text-align: left;
}

.messages {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    grid-template-rows: repeat(5, 1fr);
    gap: 8px;
    border: 4px solid rgb(0, 0, 0);
    background-color: rgb(250, 215, 215);
    width: 43%;
    height: 45%;
    position:fixed;
    left: 55%;
    top: 5%;
    border-image-width: 60px;
  border-image-outset: 6px;
  border-image-slice: 36%;
  border-image-repeat: stretch;
  border-style: solid;
  border-image-source: url("https://file.garden/ZrmnkoZC-lyg5jQj/neocities%20stuff/border.png");
  overflow: scroll;
  overflow-x: hidden;
}
    
.message1 {
    grid-column: span 2 / span 2;
    grid-row: span 5 / span 5;
}
#postone {
  height: 32.05%;
}
#postonetxt {
  height: 32%;
  position: absolute;
  bottom: 54%;
  font-size: 110%;
  left: 14.50%;
  line-height:1.2em;
  font-family:sans-serif;
}
.message2 {
    grid-column: span 2 / span 2;
    grid-row: span 5 / span 5;
}
#posttwo {
  height: 28%;
  position: absolute;
  top: 33%;
  left:0%;
}
#posttwotxt {
  height: 32%;
  position: absolute;
  bottom: 54%;
  font-size: 110%;
  left: 14.50%;
  top: 34%;
  line-height:1.2em;
  font-family:sans-serif;
}
.message3 {
    grid-column: span 2 / span 2;
    grid-row: span 5 / span 5;
}
#postthree {
  height: 52%;
  position: absolute;
  top: 66%;
  left:0%;
}
#postthreetxt {
  height: 32%;
  position: absolute;
  bottom: 54%;
  font-size: 110%;
  left: 14.50%;
  top: 66%;
  line-height:1.2em;
  font-family:sans-serif;
}
.message4 {
    grid-column: span 2 / span 2;
    grid-row: span 5 / span 5;
}
#postfour {
  height: 28%;
  position: absolute;
  top: 124%;
  left:0%;
}
#postfourtxt {
  height: 32%;
  position: absolute;
  bottom: 54%;
  font-size: 110%;
  left: 14.50%;
  top: 125%;
  line-height:1.2em;
  font-family:sans-serif;
}
/* gallery */
.gallery {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    grid-template-rows: repeat(5, 1fr);
    gap: 8px;
    border: 4px solid rgb(0, 0, 0);
    background-color: rgb(250, 215, 215);
    width: 43%;
    height: 35%;
    position:fixed;
    left: 55%;
    top: 60%;
    border-image-width: 60px;
  border-image-outset: 6px;
  border-image-slice: 36%;
  border-image-repeat: stretch;
  border-style: solid;
  border-image-source: url("https://file.garden/ZrmnkoZC-lyg5jQj/neocities%20stuff/border.png");
  overflow: scroll;
  overflow-x: hidden;
  
}
    
.gallery1 {
    grid-column: span 2 / span 2;
    grid-row: span 5 / span 5;
}
.gallery img {
  width: 100%;  
  height: 100px;  
  object-fit: cover;
}